<ion-view view-title="新增采购单" show-tabs>
    <ion-content class="create-order">

        <ion-list class="wrap-light2">

            <ion-item class="item-select">
                <span class="input-label">状态</span>
                <select ng-model="order.state" ng-options="s.state as s.note for s in stateUI">
                </select>
            </ion-item>

            <ion-item class="item-select">
                <span class="input-label">入库仓库</span>
                <select ng-model="order.wh" ng-options="w as w.name for w in warehouses track by w._id">
                </select>
            </ion-item>
            <ion-item class="item-input item-button-right">
                <span class="input-label">供应商</span>
                <input type="text" name="supplierCom" maxlength="20" required placeholder="选择供应商" ng-model="order.supplier.company">
                <a class="button button-col icon icon-left ion-android-checkmark-circle" ng-click="supplierModal.show()"> 选取</a>

            </ion-item>

            <ion-item class="item-divider margin-top-large">
                <span ng-if="order.list.length">继续</span>添加商品
            </ion-item>
            <section class="grid-response wrap-light">
                <a class="grid-item" href="#/add-product">
                    <i class="icon icon-top ion-android-add"></i>
                    <span>新增</span>
                </a>
                <a class="grid-item" ng-click="productsModal.show()">
                    <i class="icon icon-top ion-ios-list-outline"></i>
                    <span>从列表选</span>
                    <span class="badge badge-royal" ng-if="order.total_count>0">{{order.total_count}}</span>
                </a>
                <a class="grid-item" ng-click="scanBarcode()">
                    <i class="icon icon-top ion-ios-barcode-outline"></i>
                    <span>扫码添加</span>
                </a>
            </section>

        </ion-list>

        <div class="list accordion-list product-select-list" ng-if="order.list.length">
            <ion-item class="item item-divider margin-top-large">
                已选商品 ( <span class="assertive">{{order.list.length}}款 / {{order.total_count}}件</span> )
            </ion-item>
            <div class="list accordion-list product-select-list">
                <div ng-repeat="product in order.list track by $index" class="item item-thumbnail-left item-checkbox">
                    <div class="row">
                        <img ng-src="{{product.thumb}}" class="item-image"/>
                        <div class="col">
                            <h2 class="title">{{product.properties.brand.value + product.properties.model.value}}</h2>
                            <div class="prop-list">
                                <p ng-repeat="property in product.properties" class="prop-item" ng-if="property.name!='品牌' && property.name!='型号'">
                                    <span class="prop-label">{{property.name}}:</span>
                                    <span class="prop-value">{{property.value}}</span>
                                </p>
                            </div>
                        </div>
                        <div class="accordion-handle arrow right-bottom-arrow" ng-class="{on: isItemShown(product)}" ng-click="toggleItem(product)" ng-if="order.list.indexOf(product)>-1"><span class="item-count text-center padding assertive">{{product.count}}</span></div>
                    </div>



                    <div class="item-accordion margin-left" ng-if="isItemShown(product)">
                        <div class="list list-inset">
                            <label class="item item-input">
                                <span class="input-label">单价</span>
                                <input type="text" ng-model="product.cost_price">
                            </label>

                            <span class="item item-input">
                                <span class="input-label">数量</span>
                                <button class="button button-icon icon ion-ios-minus" ng-class="{'stable':product.count==1,'balanced':product.count>1}" ng-click="minusCount(product)" ng-disabled="product.count<=1"></button>
                                <input type="number" ng-model="product.count" min="1" required>
                                <button class="button balanced button-icon icon ion-ios-plus" ng-click="addCount(product)"></button>
                            </span>
                            <ion-item class="item item-base">
                                <span class="input-label">小计</span>
                                <span class="assertive">{{product.cost_price * product.count | currency:'￥'}}</span>
                            </ion-item>
                        </div>
                    </div>
                </div>
            </div>

            <ion-item class="row padding">
                <div class="col">
                    <div class="padding-bottom">已选</div>
                    <div class="assertive">{{order.list.length}}款 / {{order.total_count}}件</div>
                </div>
                <div class="col text-right">
                    <div class="padding-bottom">总额</div>
                    <div class="assertive">{{(order.total_cost | currency:'￥' )}}</div>
                </div>
            </ion-item>
            <ion-item class="item-input">
                <span class="input-label">实付金额</span>
                <input type="text" ng-model="order.paid" placeholder="{{order.total_cost | currency:'￥' }}">
            </ion-item>
            <a class="button button-block button-balanced" ng-click="create();">开单</a>

        </div>

     
    
  </ion-content>
</ion-view>
